<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2017/1/28
  Time: 18:10
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <title>按钮</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/libs/bootstrap/css/bootstrap.min.css">
    <script src="${pageContext.request.contextPath}/libs/bootstrap/js/bootstrap.js"></script>
</head>
<body>

<%--
.btn	为按钮添加基本样式	尝试一下
.btn-default	默认/标准按钮	尝试一下
.btn-primary	原始按钮样式（未被操作）	尝试一下
.btn-success	表示成功的动作	尝试一下
.btn-info	该样式可用于要弹出信息的按钮	尝试一下
.btn-warning	表示需要谨慎操作的按钮	尝试一下
.btn-danger	表示一个危险动作的按钮操作	尝试一下
.btn-link	让按钮看起来像个链接 (仍然保留按钮行为)	尝试一下
.btn-lg	制作一个大按钮	尝试一下
.btn-sm	制作一个小按钮	尝试一下
.btn-xs	制作一个超小按钮	尝试一下
.btn-block	块级按钮(拉伸至父元素100%的宽度)	尝试一下
.active	按钮被点击	尝试一下
.disabled	禁用按钮
--%>
<div class="container">
    <div class="row">
        <div class="col-sm-1">
            <button class="btn">按钮</button>
        </div>
        <div class="col-sm-1">
            <button class="btn btn-default">default按钮</button>
        </div>
        <div class="col-sm-1">
            <button class="btn btn-primary">primary按钮</button>
        </div>
        <div class="col-sm-1">
            <button class="btn btn-success">success按钮</button>
        </div>
        <div class="col-sm-1">
            <button class="btn btn-info">info 按钮</button>
        </div>
        <div class="col-sm-1">
            <button class="btn btn-warning">warning按钮</button>
        </div>
        <div class="col-sm-1">
            <button class="btn btn-danger">danger按钮</button>
        </div>
        <div class="col-sm-1">
            <button class="btn btn-link">link按钮</button>
        </div>
        <div class="col-sm-1">
            <button class="btn btn-lg">lg按钮</button>
        </div>
        <div class="col-sm-1">
            <button class="btn btn-sm">sm按钮</button>
        </div>
        <div class="col-sm-1">
            <button class="btn btn-xs">xs按钮</button>
        </div>
        <div class="col-sm-1">
            <button class="btn btn-default active">active按钮</button>
        </div>
        <div class="col-sm-1">
            <button class="btn btn-default disabled">disabled按钮</button>
        </div>
    </div>

    <div class="row">
        <div class="col-sm-6">
            <button class="btn btn-default">按钮1</button>
            <button class="btn btn-default">按钮2</button>
            <button class="btn btn-default">按钮3</button>
        </div>
        <div class="col-sm-6">
            <button class="btn btn-default btn-block">block按钮</button>
        </div>
    </div>
</div>

</body>
</html>
